<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="index.css">
    <title>扩展卡片</title>
</head>
<body>
    <!-- 扩展卡片开始 -->
        <div class="container">
            <div class="panel active" style="background-image: url(./images/test1.jpg);">
                <h3>Explore The World</h3>
            </div>
            <div class="panel" style="background-image: url(./images/test2.jpg);">
                <h3>Wild Forest</h3>
            </div>
            <div class="panel" style="background-image: url(./images/test3.jpg);">
                <h3>Sunny Beach</h3>
            </div>
            <div class="panel" style="background-image: url(./images/test4.png);">
                <h3>City on Winter</h3>
            </div>
            <div class="panel" style="background-image: url(./images/test5.jpg);">
                <h3>Mountains - Clouds</h3>
            </div>
        </div>
    <!-- 扩展卡片结束 -->
    <script src="index.js"></script>
</body>
</html>